import {Provider} from "./provider.jsx"
import {useContext} from "react"
import Ctx from "./ctx.js"
import {useColorScheme} from "@mui/joy/styles";

const useTheme = () => {
  const {mode, setMode} = useColorScheme()
  const toggleMode = () => {
    setMode(mode === 'dark' ? 'light' : 'dark')
    document.body.setAttribute("theme", mode === 'dark' ? 'light' : 'dark')
  }

  return {
    changeTheme: useContext(Ctx).changeTheme,
    toggleMode,
    mode
  }
}
export default Provider
export {useTheme}
